<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <base href="<%=request.getContextPath()%>/"/>
    <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    <script src="static/js/jquery-2.1.1.min.js"></script>
    <%@include file="../layUI.jsp" %>


</head>
<body>
<%--<form action="doGoods?action=goodsQueryLike&pageNo=1" method="post">--%>
<label>商品名称</label>
<input type="text" name="goodsName" id="goodsName">
<label>商家名称</label>
<select name="sellerName" id="sellerName">

</select>
<label>小分类名称</label>
<select name="smallName" id="smallName">
</select>
<input class="layui-btn" type="submit" value="查询" id="likeQuery">
<%--</form>--%>
<c:choose>
    <c:when test="${not empty pageData}">
        <table width="100%" style="text-align: center" class="layui-table">
            <tr>
                <th>商品id</th>
                <th>商品名称</th>
                <th>小分类名称</th>
                <th>商品的价格</th>
                <th>商品的数量</th>
                <th>商品的图像</th>
                <th>商品的运费</th>
                <th>商品的类型</th>
                <th>商家名称</th>
                <th>商品的折扣</th>
                <th colspan="2">操作</th>
            </tr>
            <tbody id="thebody">
                <%--            <c:forEach items="${Page.pageData}" var="all">--%>
                <%--                <tr>--%>
                <%--                    <td>${all.goods.id}</td>--%>
                <%--                    <td>${all.goods.goodsName}</td>--%>
                <%--                    <td>${all.smallName}</td>--%>
                <%--                    <td>${all.goods.goodsMoney}</td>--%>
                <%--                    <td>${all.goods.goodsNumber}</td>--%>
                <%--                    <td><img src="GoodsImage/${all.goods.goodsImage}"></td>--%>
                <%--                    <td>${all.goods.goodsCarriage}</td>--%>
                <%--                    <td>${all.goods.goodsType==0?'新品':'二手'}</td>--%>
                <%--                    <td>${all.seller.sellerName}</td>--%>
                <%--                    <td>${all.discount.discRate}</td>--%>
                <%--                    <td><a class="layui-btn" href="doGoods?action=goodsUpdateById&id=${all.goods.id}">修改</a></td>--%>
                <%--                    <td><a class="layui-btn" href="doGoods?action=goodsDel&id=${all.goods.id}">删除</a></td>--%>
                <%--                </tr>--%>
                <%--            </c:forEach>--%>
            </tbody>
            <tr>
                <td colspan="12">
                    <%@include file="Page.jsp" %>
                    <b class="layui-btn layui-btn-sm" onclick="jump()">跳转页面</b>
                </td>
            </tr>
        </table>
    </c:when>
    <c:otherwise>
        <h3>没有商品了</h3>
    </c:otherwise>
</c:choose>

<script src="/js/jquery-2.1.0.js"></script>
<script type="text/javascript">
    var pageCurrentNo = 1;
    var pageSize = 3;
    var totalPage = 0;
    $(function () {
        searchGoods(1);
        $.getJSON("/doGoods", {"action": "optionS"}, getSeller);
        // function getOption(data) {
        //     $("#sellerName").html("");
        //     $("#smallName").html("");
        //     var seller = eval(data.sellerName);
        //     $("#sellerName").append("<option value='0'>全部</option>");
        //     $.each(seller, function (key, value) {
        //         $("#sellerName").append("<option value='" + key + "'>" + value + "</option>");
        //     });
        //     var small = eval(data.smallName);
        //     $("#smallName").append("<option value='0'>全部</option>");
        //     $.each(small, function (key, value) {
        //         $("#smallName").append("<option value='" + key + "'>" + value + "</option>");
        //     });
        // }
        $.getJSON("/doGoods", {"action": "optionC"}, getSmall);

        $("#begin").click(function () {
            pageCurrentNo = 1;
            $.getJSON("/doGoods", {"action": "paging", "pageNo": pageCurrentNo, "goodsName": $("#goodsName").val(), "sellerName":$("#sellerName").val(), "smallName" : $("#smallName").val()}, likeQuery);
        });
        $("#prev").click(function () {
            pageCurrentNo -= 1;
            $.getJSON("/doGoods", {"action": "paging", "pageNo": pageCurrentNo, "goodsName": $("#goodsName").val(), "sellerName":$("#sellerName").val(), "smallName" : $("#smallName").val()}, likeQuery);
        });
        $("#next").click(function () {
            pageCurrentNo += 1;
            $.getJSON("/doGoods", {"action": "paging", "pageNo": pageCurrentNo, "goodsName": $("#goodsName").val(), "sellerName":$("#sellerName").val(), "smallName" : $("#smallName").val()}, likeQuery);
        });
        $("#end").click(function () {
            pageCurrentNo = $("#totalPages").html();
            $.getJSON("/doGoods", {"action": "paging", "pageNo": pageCurrentNo, "goodsName": $("#goodsName").val(), "sellerName":$("#sellerName").val(), "smallName" : $("#smallName").val()}, likeQuery);
        });

        $("#likeQuery").click(function () {
            pageCurrentNo = 1;
            $.getJSON("/doGoods", {"action": "paging", "pageNo": pageCurrentNo, "goodsName": $("#goodsName").val(), "sellerName":$("#sellerName").val(), "smallName" : $("#smallName").val()}, likeQuery);
        });
    });

    function getSeller(data) {
        $("#sellerName").html("");
        $("#sellerName").append("<option value='0'>全部</option>");
        $.each(data, function (key, value) {
            $("#sellerName").append("<option value='" + key + "'>" + value + "</option>");
        });
    }

    function getSmall(data) {
        $("#smallName").html("");
        $("#smallName").append("<option value='0'>全部</option>");
        $.each(data, function (key, value) {
            $("#smallName").append("<option value='" + key + "'>" + value + "</option>");
        });
    }
    
    function likeQuery(result) {
        $("#thebody").html("");
        for (var i = 0; i < result.lists.length; i++) {
            $("#thebody").append(
                "<tr><td>" + result.lists[i].id + "</td>" +
                "<td>" + result.lists[i].goodsName + "</td>" +
                "<td>" + result.lists[i].smallName + "</td>" +
                "<td>" + result.lists[i].goodsMoney + "</td>" +
                "<td>" + result.lists[i].goodsNumber + "</td>" +
                "<td>" + "<img src='/GoodsImage/" + result.lists[i].goodsImage + "'/>" + "</td>" +
                "<td>" + result.lists[i].goodsCarriage + "</td>" +
                "<td>" + (result.lists[i].goodsType == 0 ? "新品" : "二手") + "</td>" +
                "<td>" + result.lists[i].sellerName + "</td>" +
                "<td>" + result.lists[i].discount + "</td>" +
                "<td><a class='layui-btn' href='doGoods?action=goodsQueryById&id=" + result.lists[i].id + "'>修改</a></td>" +
                "<td><a class='layui-btn' href='doGoods?action=goodsDelById&id=" + result.lists[i].id + "'>删除</a></td></tr>"
            )
        }
        $("#pageNo").html(pageCurrentNo);
        $("#totalPages").html(result.totalPage);
        $("#jump1").html("");
        for (let i = 0; i < result.totalPage; i++) {
            if (i + 1 == pageCurrentNo){
                $("#jump1").append("<option value='" + (i + 1) + "' selected><a href='javascript:void(0)' onclick='searchGoods((i + 1))'>" + (i + 1) + "页</a></option>");
            }else{
                $("#jump1").append("<option value='" + (i + 1) + "'><a href='javascript:void(0)' onclick='searchGoods((i + 1))'>" +  (i + 1) + "页</a></option>");
            }
        }
        showhide(pageCurrentNo, result.totalPage);
    }

    function searchGoods(pageNo) {
        pageCurrentNo = pageNo;
        $("#thebody").html("");
        $.getJSON("/doGoods", {"action": "paging", "pageNo": pageCurrentNo}, callback);

        function callback(result) {
            for (var i = 0; i < result.lists.length; i++) {
                $("#thebody").append(
                    "<tr><td>" + result.lists[i].id + "</td>" +
                    "<td>" + result.lists[i].goodsName + "</td>" +
                    "<td>" + result.lists[i].smallName + "</td>" +
                    "<td>" + result.lists[i].goodsMoney + "</td>" +
                    "<td>" + result.lists[i].goodsNumber + "</td>" +
                    "<td>" + "<img src='GoodsImage/" + result.lists[i].goodsImage + "' />" + "</td>" +
                    "<td>" + result.lists[i].goodsCarriage + "</td>" +
                    "<td>" + (result.lists[i].goodsType == 0 ? "新品" : "二手") + "</td>" +
                    "<td>" + result.lists[i].sellerName + "</td>" +
                    "<td>" + result.lists[i].discount + "</td>" +
                    "<td><a class='layui-btn' href='doGoods?action=goodsQueryById&id=" + result.lists[i].id + "'>修改</a></td>" +
                    "<td><a class='layui-btn' href='doGoods?action=goodsDelById&id=" + result.lists[i].id + "'>删除</a></td></tr>"
                )
            }
            $("#pageNo").html(pageCurrentNo);
            $("#totalPages").html(result.totalPage);
            $("#jump1").html("");
            for (let i = 0; i < result.totalPage; i++) {
                if (i + 1 == pageCurrentNo){
                    $("#jump1").append("<option value='" + (i + 1) + "' selected><a href='javascript:void(0)' onclick='searchGoods((i + 1))'>" + (i + 1) + "页</a></option>");
                }else{
                    $("#jump1").append("<option value='" + (i + 1) + "'><a href='javascript:void(0)' onclick='searchGoods((i + 1))'>" +  (i + 1) + "页</a></option>");
                }
            }
            showhide(pageCurrentNo, result.totalPage);
        }
    }

    function showhide(currentPage, totalPages) {
        if (currentPage == 1) {
            $("#prev").hide();
            $("#next").show();
        }
        if (currentPage > 1 && currentPage < totalPages) {
            $("#prev").show();
            $("#next").show();
        }
        if (currentPage == totalPages) {
            $("#prev").show();
            $("#next").hide();
        }
        if (totalPages == 1) {
            $("#prev").hide();
            $("#next").hide();
        }
    }

    function jump() {
        var jumpPage = $("#jump1").find("option:selected").val();
        pageCurrentNo = jumpPage;
        $.getJSON("/doGoods", {"action": "paging", "pageNo": jumpPage, "goodsName": $("#goodsName").val(), "sellerName":$("#sellerName").val(), "smallName" : $("#smallName").val()}, likeQuery);
    }
</script>
</body>
</html>
